/* eslint-disable camelcase */
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import ClusterDeviceUpdateCard from '../cluster-device-update-card';
import { clusterUpgrade } from '@api/update';
import _ from 'lodash';
import './index.less';
import { getNodeList, nodeInfo } from '@api/nodes';
import { message, Spin } from 'antd';

const prefixCls = 'cluster-device-update';

class ClusterDeviceUpdate extends Component {
  constructor(props) {
    super(props);
    this.state = {
      list: [],
      loading: false,
      itemLoading: null,
      dataList: [],
      isFirstRequest: false
    };
    this.pollingTimer = null;
  }

  componentDidMount() {
    this.setState({ isFirstRequest: true });
    this.getNodeList();
  }

  componentWillUnmount() {
    window.clearInterval(this.pollingTimer);
  }

  setIsFirstRequest = () => {
    this.setState({ isFirstRequest: false });
  };

  setDataListInfo = () => {
    let { list } = this.state;
    const cloneList = [...list];
    list.forEach(r => {
      nodeInfo(r?.node_ip).then(data => {
        const result = data?.data?.data;
        let index = list.findIndex(i => i.node_ip === result.node_ip);
        cloneList[index] = { ...cloneList[index], ...result };
        this.setState({ list: cloneList });
      });
    });
  };
  getNodeList = () => {
    getNodeList()
      .then(res => {
        this.setState({ loading: true });
        const list = _.get(res, 'data.data', []);
        this.setState({ list });
        this.setDataListInfo();
      })
      .finally(() => {
        this.setState({ loading: false });
      });
  };

  updateNode = (ip, type, key) => {
    const { edition } = this.props;
    const { list } = this.state;
    this.setState({ itemLoading: key });
    clusterUpgrade({
      node_list: [ip],
      update_type: type,
      vision:
        type === 'system'
          ? edition
          : _.get(list.find(item => item.node_role === 'master'), 'repository_stats.version', '')
    })
      .then(() => {
        message.success('正在升级！');
      })
      .catch(e => {
        message.error(e.message);
      })
      .finally(() => {
        this.setState({ itemLoading: null });
      });
  };

  updateNode = (ip, type, key) => {
    const { edition } = this.props;
    const { list } = this.state;
    this.setState({ itemLoading: key });
    clusterUpgrade({
      node_list: [ip],
      update_type: type,
      vision:
        type === 'system'
          ? edition
          : _.get(list.find(item => item.node_role === 'master'), 'repository_stats.version', '')
    })
      .then(() => {
        message.success('正在升级！');
      })
      .catch(e => {
        message.error(e.message);
      })
      .finally(() => {
        this.setState({ itemLoading: null });
      });
  };

  render() {
    const { list, loading, itemLoading, isFirstRequest } = this.state;
    const { edition, nodesProgressList } = this.props;
    const resourceEdition = _.get(
      list.find(item => item.node_role === 'master'),
      'repository_stats.version',
      ''
    );
    return (
      <Spin spinning={loading}>
        <div className={prefixCls}>
          <div className={`${prefixCls}-page-title`}>集群设备</div>
          <div className={`${prefixCls}-content`}>
            {list.map((item, index) => {
              return (
                <Spin spinning={index === itemLoading} key={index}>
                  <ClusterDeviceUpdateCard
                    isFirstRequest={isFirstRequest}
                    getNodeList={this.getNodeList}
                    edition={edition}
                    device={item}
                    nodesProgress={nodesProgressList}
                    updateNode={this.updateNode}
                    resourceEdition={resourceEdition}
                    setIsFirstRequest={this.setIsFirstRequest}
                  />
                </Spin>
              );
            })}
          </div>
        </div>
      </Spin>
    );
  }
}

ClusterDeviceUpdate.propTypes = {
  data: PropTypes.array,
  edition: PropTypes.string,
  nodesProgressList: PropTypes.array
};

export default ClusterDeviceUpdate;
